<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>今日生机论坛--用户个人信息页面</title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="icon" href="../favicon.ico">

		<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
		<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.min.js"></script>
		<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
		<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>

	</head>
	<body>
		<!-- 头部模块 -->
		<div id="head"></div>

		<div class="container">
			<div class="row">
				<div class="col-6">
					<div class="h4 text-primary">头像</div>
					<div>
						<div
							style="position: relative;border: 5px solid lightblue;width: 150px;height:150px;margin: 5px auto;border-radius: 50%;">
							<img src="../img/defaultHeadPortrait/defaultHeadPortrait.jpeg" alt="选择并上传头像" id="avatar_img"
								style="width: 140px;height: 140px;left:0;top: 0;border-radius: 50%;" />
							<input type="file" id="avatar_file" name="avatar_file"
								accept="image/jpg,image/png,image/gif"
								style="width: 100%;height:100%;opacity: 0;position: absolute;left:0;top: 0;" />
						</div>
					</div>
					<div class="h4 text-primary">基本信息</div>
					<div>
						<form role="form">
							<div class="form-group">
								<label class="col-2 control-label">姓名</label>
								<div class="col-6">
									<input type="text" class="form-control" th:value="${byId.userName}" disabled>
								</div>
							</div>
							<div class="form-group">
								<label class="col-2 control-label">邮箱</label>
								<div class="col-6">
									<input type="text" class="form-control" th:value="${byId.userName}">
								</div>
							</div>
							<div class="form-group">
								<label  class="col-3 control-label">注册时间</label>
								<div class="col-6">
									<input type="text" class="form-control" disabled th:value="${byId.userCreatetime}">
								</div>
							</div>
							<div class="form-group">
								<label class="col-2 control-label">年龄</label>
								<div class="col-6">
									<input type="text" class="form-control" th:value="${byId.userAge}" disabled>
								</div>
							</div>
							<div class="checkbox">
								<label class="col-2 control-label">性别</label>
								<div class="col-6" th:switch="${byId.userSex}">
									<label th:case="男"><input type="radio" name="sex" value="男" checked>男</label>
									<label th:case="女"><input type="radio" name="sex" value="女">女</label>
								</div>
							</div>
							<div class="form-group">
								<label class="col-2 control-label">电话</label>
								<div class="col-6">
									<input type="text" class="form-control" th:value="${byId.userNumber}">
								</div>
							</div>
							<div class="form-group">
								<label class="col-2 control-label">昵称</label>
								<div class="col-6">
									<input type="text" class="form-control" th:value="${byId.userNickname}">
								</div>
							</div>
							<div class="form-group">
								<label class="col-2 control-label">生日</label>
								<div class="col-6">
									<input type="date" class="form-control" th:value="${byId.userBirthday}">
								</div>
							</div>
							<div class="form-group">
								<div class="col-2 offset-2">
									<input type="button" class="form-control btn-primary" value="保存">
								</div>
							</div>
						</form>
					</div>
				</div>
				<div class="col-6">
					<div class="h4 text-primary">我发布的帖子：</div>
					<table class="table table-striped mt-5" style="table-layout: fixed;">
						<caption>我发布的帖子</caption>
						<thead>
							<tr>
								<th>标题</th>
								<th>内容</th>
								<th>回复</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody th:each="list,listIter:${list}">
							<tr>
								<td class="overflow-hidden table" style="text-overflow:ellipsis; white-space: nowrap;" th:text="${list.articleTitle}">
									<!--希望人没事--></td>
								<td class="overflow-hidden table" style="text-overflow:ellipsis; white-space: nowrap;" th:text="${list.articleContent}">
									<!--我希望人没事我希望人没事我希望人没事-->
								</td>
								<td th:text="${list.articleCommentCount}"><!--23--></td>
								<td><a th:href="@{/article/detailed(articleId=${list.articleId})}">查看</a>&emsp;<a th:href="@{/article/delete(articleId=${list.articleId},userId=${byId.userId})}">删除</a></td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>

		<script>
			$().ready(function() {
				$("#head").load("head.html")
			});
		</script>
	</body>
</html>
